<!-- 
 
 
 
 -->


<template>
	<view class="uni-margin-wrap">
		<swiper class="swiper" :style="config.style" circular
			 :autoplay="config.autoplay"
			 :duration="config.duration |1000" 
			 :interval="config.interval ||2000"
			 :indicator-dots ="config.indicatorDots"
		 >
			<swiper-item v-for="item in config.swiperList"  :key="item._id" >
				<!-- <web-view :src="item.url"> -->
				<image :src="domain+item.imageUrl" mode=""></image>
				<!-- </web-view> -->
			</swiper-item>
		</swiper>
		
		<button @click="sendToFather">往父组件传值</button>
	</view>
</template>

<script setup>
import {ref,reactive,onBeforeMount} from "vue";
import {onLoad} from "@dcloudio/uni-app";
import {domain} from "@/env.js"
// 父往子传值.子组件里面接收的方式
const props = defineProps({
	config:{
		type:Object,
		
	}
})
const $emit = defineEmits(["enentone","eventtwo"])
onBeforeMount(()=>{
	console.log("我是组件的生命周期onBeforeMount")
})
onLoad(()=>{
	console.log("我是组件的生命周期onLoad",props.config)
})

const sendToFather = ()=>{
	//  v2
	// this.$emit("自定义事件名",参数)
	// v3
	$emit("enentone",{name:"马亚迪",weight:"140公斤"})
	 
}
</script>

<style lang="scss" scoped>
	  .uni-margin-wrap {
		  border: 1px solid red;
	  		width: 750rpx;
	  	}
	  	.swiper {
	  		height: 300rpx;
	  	}
	  	.swiper-item {
	  		display: block;
	  		height: 300rpx;
	  		line-height: 300rpx;
	  		text-align: center;
	  	}
	  	.swiper-list {
	  		margin-top: 40rpx;
	  		margin-bottom: 0;
	  	}
	  	.uni-common-mt {
	  		margin-top: 60rpx;
	  		position: relative;
	  	}
	  	.info {
	  		position: absolute;
	  		right: 20rpx;
	  	}
	  	.uni-padding-wrap {
	  		width: 550rpx;
	  		padding: 0 100rpx;
	  	}     
</style>
